﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-trasitional.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script src="~/javascript/jquery-1.7.2.js"></script>
    <link href="~/css/table.css" rel="stylesheet" />
    <script src="~/javascript/comm/comm.js"></script>
    <STYLE type="text/css">
        td {
            text-align: center
        }
    </STYLE>
</head>

<body>
    <div id="app">
        <table width="100%">
            <tr>
                <td colspan="2" style="text-align: left">
                    <font color="black">
                        您正在做的业务是：人力资源--薪酬标准管理--薪酬发放登记(负责人控制)
                    </font>
                </td>
            </tr>

        </table>
        <br>
        薪酬总数:{{rows}}，
        总人数:1，基本薪酬总数:3900.0，实发总额:3900.0
        <table width="100%" border="1" cellpadding=0 cellspacing=1
               bordercolorlight=#848284 bordercolordark=#eeeeee
               class="TABLE_STYLE1">

            <tr>
                <td width="10%" class="TD_STYLE1">
                    <span>序号</span>
                </td>

                <td width="40%" class="TD_STYLE1">
                    <span v-if="@ViewData["kind"]==1">I级机构名称</span>
                    <span v-if="@ViewData["kind"]==2">II级机构名称</span>
                    <span v-if="@ViewData["kind"]==3">III级机构名称</span>
                </td>

                <td width="10%" class="TD_STYLE1">
                    <span>人数</span>
                </td>
                <td width="10%" class="TD_STYLE1">
                    基本薪酬总额(元)
                </td>
                <td width="10%" class="TD_STYLE1">
                    登记
                </td>
            </tr>


            <tr class="TD_STYLE2" v-for="(item,index) in dt" :key="index">
                <td>
                    {{item.sgr_id}}
                </td>
                <td>
                    <span v-if="@ViewData["kind"]==1">{{item.first_kind_name}}</span>
                    <span v-if="@ViewData["kind"]==2">{{item.second_kind_name}}</span>
                    <span v-if="@ViewData["kind"]==3">{{item.first_kind_name}}</span>
                </td>
                <td>
                    {{item.human_amount}}
                </td>
                <td>
                    {{item.salary_standard_sum}}
                </td>
                <td>
                    <a v-on:click="grant([item.salary_grant_id],[item.salary_standard_id],[item.salary_standard_sum],[item.salary_paid_sum],[item.human_amount])">登 记</a>
                </td>
            </tr>
        </table>
        <p>
            &nbsp;
        </p>
        <div align="center" style="font-size: 18px;color: gray">
            &nbsp;&nbsp;总数：
            <font style="color: maroon;font-weight: bold;">{{rows}}</font>
            例
            &nbsp;&nbsp;&nbsp;
            每页显示 <font style="color: maroon;font-weight: bold;">{{pageSize}}</font>
            条
            &nbsp;&nbsp;&nbsp;
            当前第 <font style="color: maroon;font-weight: bold;">{{currentPage}}</font>
            页
            &nbsp;&nbsp;&nbsp;共
            <font style="color: maroon;font-weight: bold;">{{pages}}</font>
            页
            <a style="color: navy;font-weight: bold" v-on:click="first()">首页</a>

            <a style="color: navy;font-weight: bold"
               v-on:click="prev()">上一页</a>

            <a style="color: navy;font-weight: bold"
               v-on:click="next()">下一页</a>

            <a style="color: navy;font-weight: bold"
               v-on:click="last()">末页</a>
            &nbsp;&nbsp;&nbsp;跳到第
            <input id=page type=text v-model="tpage" class=input1 size=1>
            页&nbsp;&nbsp;
            <input type="image" v-on:click="tiao()" src="~/images/go.bmp" width=18 height=18 border=0>
        </div>
    </div>
</body>
</html>

<script type="text/javascript">
    var vm = new Vue({
        el: "#app",
        data: {
            dt: [],//要显示的数据
            rows: 0,//总个数
            pages: 0,//总页数
            currentPage: 1,//当前页
            pageSize: 3,//一页几个
            tpage: 1,//要跳的页数
        },
        methods: {
            load: function () {
                var t = this;
                $.ajax({
                    url: "/salaryGrant/register?currentPage=" + t.currentPage,
                    type: "post",
                    success: function (msg) {
                        var d = eval(msg);
                        t.dt = d["list"];
                        t.rows = d["rows"];
                        t.pages = d["pages"];
                    }
                });
            },
            first: function () {
                this.currentPage = 1;
                this.load();
            },
            prev: function () {
                if (this.currentPage > 1) {
                    this.currentPage = this.currentPage - 1;
                    this.load();
                }
            },
            next: function () {
                if (this.currentPage < this.pages) {
                    this.currentPage = this.currentPage + 1;
                    this.load();
                }

            },
            last: function () {
                this.currentPage = this.pages;
                this.load();
            },
            tiao: function () {
                if (this.tpage > 0 && this.tpage <= this.pages) {
                    this.currentPage = this.tpage;
                    this.load();
                }
            },
            grant: function (sgid, stid, tsum, psum, hnum) {
                location.href = '/salaryGrant/register_commit?sgid=' + sgid + "&stid=" + stid + "&tsum=" + tsum + "&psum=" + psum + "&humanNum=" + hnum + "&kind=" + @ViewData["kind"];
            }
        },
        mounted: function () {
            this.load();
        }
    });
</script>

